<template>
  <view class="index" :style="['padding: 0 28rpx;']">
    <!-- 返回 -->
    <view>
      <navTabrBack :navbackStyle="['display:none']" :title="'交易委托'"></navTabrBack>
    </view>
    <!-- 委托列表 -->
    <view class="entrustList">
      <view
        class="entrustItem"
        @click="toEntrustDEtails(item.ID)"
        v-for="(item, index) in dataList"
        :key="item.ID"
      >
        <view class="entTimeB">
          <view class="entTimeS"></view>
          <view class="entrustTime"> 截止时间：{{ item.endTime?.split("T")[0] }} </view>
          <!-- <image
           
            src="../../static/img/page/03.png"
            mode="scaleToFill"
          /> -->
        </view>
        <view class="entTile">{{ item.title }} </view>
        <view class="entrInfo">
          <view>专利类型：{{ item.baseTypeName }}</view>
          <view>专利状态：{{ item.baseStatus }}</view>
        </view>
      </view>
      <view></view>
    </view>
  </view>
</template>

<script setup>
import { inject, toRefs, reactive } from "vue";
import { onPullDownRefresh, onReachBottom, onShow } from "@dcloudio/uni-app";
onPullDownRefresh(() => {
  data.dataList = [];
  data.page = 1;
  // uni.getStorage({
  //   key: "useInfo",
  //   fail: (err) => {
  //     uni.redirectTo({
  //       url: "/pages/login/login",
  //     });
  //   },
  //   success: function (res) {
  //     data.userInfo = res.data;
  //   },
  // });
  updataList();
  uni.stopPullDownRefresh();
});
onReachBottom(() => {
  data.page = data.page + 1;
  updataList();
});
const $url = inject("$url");
let data = reactive({
  dataList: [],
  page: 1,
  userInfo: {},
});
let { dataList } = toRefs(data);
const updataList = () => {
      uni.request({
        url: $url + `/base/getZlEntrustList?page=${data.page}&pageSize=10&auditStatus=1&isClosed=0 `,
        method: "GET",
        timeout: 6000,
        // header: {
        //   "x-token": res.data.token,
        // },
        fail: (err) => {
          console.log(err, "请求失败！");
        },
        success(res) {
          res.data.data.list.map((item) => {
            data.dataList.push(item);
          });
        },
      });
  // 用户登陆状态
  uni.getStorage({
    key: "useInfo",
    fail: (err) => {
      //   uni.redirectTo({
      //   url: "/pages/login/login",
      // });
    },
    success: function (res) {
      // if (!res.data.token?.length > 0) {
      //   uni.redirectTo({
      //     url: "/pages/login/login",
      //   });
      // }
    },
  });
};
onShow(() => {
  uni.getStorage({
    key: "useInfo",
    success: function (res) {
      // 请求用户信息
      let token = res.data.token;
      uni.request({
        url: $url + `/user/getUserInfo`,
        method: "GET",
        timeout: 6000,
        header: {
          "x-token": token,
        },
        fail: (err) => {
          console.log(err, "请求失败！");
        },
        success(res) {
          if (res.data.data?.userInfo) {
            res.data.data.userInfo.token = token;
            uni.setStorage({
              key: "useInfo",
              data: res.data.data.userInfo,
              success: function () {},
            });
          } else {
            wx.clearStorage({
              success(res) {},
              fail(err) {
                console.log("退出失败！", err);
              },
            });
          }
        },
      });
    },
  });
  data.dataList = []
  data.page = 1
  updataList();
  // 在小程序下面检测openid过期
  // if (uni.getSystemInfoSync().hostName === "WeChat") {
  //   wx.checkSession({
  //     success() {
  //     },
  //     fail() {
  //       uni.redirectTo({
  //         url: "/pages/login/login",
  //       });
  //     },
  //   });
  // }
});
const toEntrustDEtails = (id) => {
  uni.navigateTo({ url: `/pages/entrustDetails/index?id=${id}` });
};
</script>

<style scoped>
.index {
  min-height: 100vh;
  background: linear-gradient(
    157deg,
    #ccdbfe 0%,
    #d9eeeb 17%,
    #f3f5f8 23%,
    #f4f6f9 56%,
    #f4f6f9 75%,
    #f4f6f9 100%
  );
  padding-bottom: 55rpx;
}
/* 委托列表 */
.entrustList {
  margin-top: 38rpx;
}
.entrustItem {
  width: 696rpx;
  height: 228rpx;
  background: #ffffff;
  box-shadow: 0rpx 0rpx 11rpx 0rpx #f7f7f7;
  border-radius: 11rpx;
  margin-bottom: 36rpx;
}
.entTimeB {
  display: flex;
  justify-content: flex-end;
}
.entTimeS {
  width: calc(100% - 332rpx);
}
.entrustTime {
  display: flex;
  align-items: center;
  padding-left: 48rpx;
  padding-right: 17rpx;
  height: 54rpx;
  border-radius: 0rpx 11rpx 0rpx 14rpx;
  background-image: url("");
  font-size: 25rpx;
  font-weight: 400;
  color: #ffffff;
}
.entTile {
  margin: 15rpx 20rpx 18rpx 20rpx;
  padding-top: 24rpx;
  padding-left: 18rpx;
  height: 72rpx;
  background: #f9f9fb;
  border-radius: 11rpx;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 29rpx;
  font-weight: 700;
  color: #333333;
}
.entrInfo {
  display: flex;
  font-size: 25rpx;
  font-weight: 400;
  color: #999999;
  align-items: center;
  justify-content: space-between;
  padding: 0 18rpx;
}
</style>
